<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>餐饮首页</title>

    <%-- 静态包含 base标签、css样式、jQuery文件 --%>
    <%@include file="/pages/common/head.jsp" %>


    <script type="text/javascript">
        $(function () {
            // 给加入购物车绑上单击事件  判断用户是否已登录
            $("button.addToCart").click(function () {
                if (${sessionScope['user'] != null}) {
                    let foodId = $(this).attr("foodId");
                    let foodName = $(this).attr("foodName");
                    // location.href = "http://localhost:8080/Catering_manage/cartServlet?action=addItem&id=" + foodId + "&foodName=" + foodName;

                    // 发ajax请求到控制台
                    $.getJSON("http://localhost:8080/Catering_manage/cartServlet", "action=ajaxToCart&id=" + foodId + "&foodName=" + foodName, function (data) {
                        $("div.addToCartMessage").find("span:first").text("您的菜品车中有 " + data.totalCount + " 件商品");
                        $("div.addToCartMessage").find("div:first").find("span:first").text(data.lastName);
                    });
                } else {
                    location.href = "http://localhost:8080/Catering_manage/pages/user/login.jsp";
                }
            });
        });
    </script>

    <style>
        .food_class a {
            border: 2px #666 solid;
            margin: 10px 10px;
            padding: 5px;
            width: 30px;
            height: 20px;
            font-weight: 700;
            text-decoration: none;
        }
        #main {
            height: 500px;
            width: 1200px;
            border: 1px black solid;
            overflow: auto;
        }
    </style>
</head>

<body>
<div id="header">
    <span class="wel_word">餐饮系统</span>
    <div>
        <c:if test="${sessionScope['user'] == null}">
            <a href="pages/user/login.jsp">登录</a> |
            <a href="pages/user/regist.jsp">注册</a>
            <a href="pages/user/login.jsp">菜品车</a>
        </c:if>
        <c:if test="${sessionScope['user'] != null}">
            <span>欢迎<span class="um_span">${sessionScope['user'].username}</span>光临餐饮管理</span>
            <a href="orderServlet?action=searchOrder&id=" + ${sessionScope['user'].id} >我的订单</a>
            <a href="userServlet?action=loginOut">注销</a>
            <a href="pages/cart/cart.jsp">菜品车</a>
        </c:if>


        <a href="pages/manager/manager.jsp?user_manager=1">后台管理</a>
    </div>
</div>
<div id="main">
    <div id="food">
        <div class="food_cond" style="text-align: center">
            <div class="food_class" style="margin-top: 10px; margin-bottom: 10px; text-align: left">
                <a href="client/foodServlet?action=listLimitClass&id=1&food_id=1">川菜</a>
                <a href="client/foodServlet?action=listLimitClass&id=1&food_id=2">粤菜</a>
                <a href="client/foodServlet?action=listLimitClass&id=1&food_id=3">湘菜</a>
                <a href="client/foodServlet?action=listLimit&id=1">所有菜品</a>
            </div>
            <form action="client/foodServlet" method="get">
                <input type="hidden" name="action" value="priceSearchClass">
                <input type="hidden" name="food_id" value="${param['food_id']}">
                <input type="hidden" name="id" value="1">
                价格：<input id="min" type="text" name="min" value="${param['min']}"> 元 -
                <input id="max" type="text" name="max" value="${param['max']}"> 元
                <input type="submit" value="查询"/>
            </form>
        </div>
        <div style="text-align: center" class="addToCartMessage">
            <span>您的菜品车中有件商品</span>
            <div>
                您刚刚将<span style="color: red"></span>加入到了菜品车中
            </div>
        </div>
        <c:forEach items="${requestScope['msg']}" var="food">
            <div class="b_list" style="margin-left: 23px; margin-right: 23px">
                <div class="img_div">
                    <img class="food_img" alt="" src="${food.img_path}"/>
                </div>
                <div class="food_info" style="text-align: center">
                    <div class="food_name">
                        <span class="sp1">菜名:</span>
                        <span class="sp2">${food.food_name}</span>
                    </div>
                    <div class="food_price">
                        <span class="sp1">价格:</span>
                        <span class="sp2">￥${food.price}</span>
                    </div>
                    <div class="food_price">
                        <c:if test="${food.food_id  == 1}">
                            <span class="sp1">菜类:川菜</span>
                        </c:if>
                        <c:if test="${food.food_id  == 2}">
                            <span class="sp1">菜类:粤菜</span>
                        </c:if>
                        <c:if test="${food.food_id  == 3}">
                            <span class="sp1">菜类:湘菜</span>
                        </c:if>
                    </div>

                    <div class="food_add">
                        <button foodId="${food.id}" foodName="${food.food_name}" class="addToCart">加入菜品车</button>
                    </div>
                </div>
            </div>
        </c:forEach>
    </div>

    <div id="page_nav" style="text-align: center">
        <form action="client/foodServlet" method="get">
            <span>当前页：${param['id']}页</span>
            <c:if test="${param['id']>1}">
                <a href="client/foodServlet?action=${param['action']}&id=1&min=${param['min']}&max=${param['max']}&food_id=${param.food_id}">首页</a>
                <a href="client/foodServlet?action=${param['action']}&id=${param["id"] - 1==0?1:param["id"] - 1}&min=${param['min']}&max=${param['max']}&food_id=${param.food_id}">上一页</a>
            </c:if>

            <c:forEach var="page" begin="1" end="${requestScope['pages']}" step="1">
                <c:if test="${param['id'] -2 <= page && param['id'] + 2 >= page}">
                    <a href="client/foodServlet?action=${param['action']}&id=${page}&min=${param['min']}&max=${param['max']}&food_id=${param.food_id}">
                        <c:if test="${page==param['id']}">【${param['id']}】</c:if>
                        <c:if test="${page!=param['id']}"> ${page}</c:if>
                    </a>
                </c:if>
            </c:forEach>

            <c:if test="${param['id']<requestScope['pages']}">
                <a href="client/foodServlet?action=${param['action']}&id=${param["id"]==requestScope['pages']?param["id"]:param["id"] + 1}&min=${param['min']}&max=${param['max']}&food_id=${param.food_id}">下一页</a>
                <a href="client/foodServlet?action=${param['action']}&id=${requestScope['pages']}&min=${param['min']}&max=${param['max']}&food_id=${param.food_id}">末页</a>
            </c:if>

            共${requestScope['pages']}页，${requestScope['number']}条记录

            <input type="hidden" name="max" value="${param['max']}"/>
            <input type="hidden" name="min" value="${param['min']}"/>
            <input type="hidden" name="action" value="listLimitClass">
            到第<input value="${param['id']}" style="width: 16px" name="id"/>页
            <input type="hidden" name="food_id" value="${param['food_id']}">
            <input type="submit" value="确定">
        </form>
    </div>

</div>
<%@include file="/pages/common/footer.jsp" %>
</body>
</html>